Outline.html ver0.x

https://gyazo.com/e2ab5d7a8a4bc1cc5712a0b1cbc61238

意外といける

なぜ作っているのか

項目自体に本文以外の情報をセットできるアウトライナーがほしい

あと2ペインにしたい

その他自分に合う形を模索したい

やってみた結果やっぱりちゃんとしたサービスを利用するのが良いなとなったらそれはそれで

単にJavaScriptが楽しくなってきたからできそうなことを試したいというのもある

実装できたこと

項目のテキストの編集

コピペした際にHTMLタグが入らないように処理

Enterで下に新規項目を追加

子項目の開閉

ドラッグアンドドロップで項目を移動

フォーカス（的なもの）

各項目のメタデータを表示

子項目を通常画面と同じように表示

操作も可能（だけど操作した結果の保存はこれから実装）

attr欄に書いた文字列によって背景色・文字色を変更

出典・リンクをメタデータに書いておくと項目の右端にアイコンが出る

クリックで開く

localStorageからデータを呼び出し

インデントはまだ反映されない

localStorageへの書き込みはこれから

できていない且つすぐできないかもしれないこと

キーボードショートカット

複数行選択

検索

（どういう形に表示するかがまだ決まっていない）

できないであろうこと

複数行のテキストを他からコピペした時に自動で1行1項目で項目を作る

（そもそもそういう使い方を想定していない）

他のサービスと互換性のある形で出力

これは絶対に不可能

でもMarkdownの箇条書きに変換とかScrapboxにすぐ貼れる形にするとかは多分簡単にできると思われる

どうでもいい補足

スクリーンショット中の「noid」は「のらてつアウトラインID」の略です

（スクリーンショット撮るにあたって普通に「ID」にしようと思って忘れてた）

各項目にidでもclassでもない属性がほしいなと思ってカスタム属性を付与してみた

なお実際のノードは作成日時がIDになります

実装できたこと、ってさらっと書いていますがそれなりに各所で悪戦苦闘しました